import Detail from "./detail.vue";
import { message } from "@/utils/message";
import { addDialog } from "@/components/ReDialog";
import {
  deleteSystemLogs,
  getSystemLogs,
  getSystemLogsDetail
} from "@/api/system";

export function useLogSys() {
  const dataList = ref({});
  const loading = ref(true);
  const selectedNum = ref(0);
  const tabList = {
    danger: "错误日志",
    warning: "警告日志",
    access: "请求日志",
    info: "一般日志"
  };
  const activeKey = ref("danger");

  const columns: TableColumnList = [
    {
      label: "日期",
      prop: "date"
    },

    {
      label: "级别",
      cellRenderer: () => (
        <el-tag type={activeKey.value} effect="plain">
          {tabList[activeKey.value]}
        </el-tag>
      )
    },
    {
      label: "大小",
      prop: "size"
    },
    {
      label: "操作",
      slot: "operation"
    }
  ];

  function tabChange(active: string) {
    activeKey.value = active;
  }
  /** 删除 */
  async function onDelete(row: object) {
    await deleteSystemLogs({ type: activeKey.value, ...row });
    onSearch();
  }

  function onDetail(row) {
    if (!row.size) return message("暂无日志详情", { type: "warning" });
    getSystemLogsDetail({ date: row.date, type: activeKey.value }).then(res => {
      addDialog({
        title: `日志详情：${res.name}`,
        fullscreen: true,
        hideFooter: true,
        contentRenderer: () => Detail,
        props: {
          data: res
        }
      });
    });
  }

  function onSearch() {
    loading.value = true;
    getSystemLogs()
      .then(data => {
        dataList.value = data;
      })
      .finally(() => {
        loading.value = false;
      });
  }
  onMounted(() => {
    onSearch();
  });

  return {
    tabList,
    activeKey,
    loading,
    columns,
    dataList,
    selectedNum,
    tabChange,
    onSearch,
    onDetail,
    onDelete
  };
}
